<template>
	<view class="uni-tab-bar">
		<div id="root">
			<div class="playlist-detail">
				<div>
					<div class="playlist-detail__bg">
						<img :src="item.imageUrl">
						<i></i>
					</div>
					<div class="playlist-detail__top">
						<p class="playlist-detail__title">{{item.title}}</p>
						<p class="playlist-detail__amount">为你推荐 {{item.videoCount}} 个视频</p>
						<p class="playlist-detail__view Hairline Hairline_box-outer">{{item.playCount / 10000}} 万播放</p>	
					</div>
					<div class="playlist-detail__content">
						<view v-for="(it, idx) in item.videoList" v-bind:key="idx" wx:key="idx" class="playlist-detail__item-wrap mf-item">
							<div class="playlist-detail__item" data-dom-uid="6">
								<div class="playlist-detail__poster Lazy Lazy_loaded">
									<video class="playlist-detail__video" :src="it.detailInfo.url" :poster="it.videoImageUrl"></video>
								</div>
							</div>
							<div class="playlist-detail__control">
								<p class="playlist-detail__item-title">
									{{it.videoTitle}}
									<br>
									<block v-for="(tag, iddx) in it.detailInfo.titleTags" v-bind:key="iddx">
										<text class="playlist-detail__item-tag">{{it.detailInfo.titleTags[iddx]}}</text>
									</block>
								</p>
							</div>
						</view>
					</div>
					<div v-if="item.nextVideoSet" @click="goDetail(item.nextVideoSet)" class="playlist-detail__footer">
						<a class="playlist-detail__next-link">
							<div class="playlist-detail__next">
								<div class="playlist-detail__next-img Lazy Lazy_loaded">
									<img :src="item.nextVideoSet.imageUrl">
									<i class="Lazy__cover" style="display: none;"></i>
								</div>
								<p class="playlist-detail__next-title">{{item.nextVideoSet.title}}</p>
								<p class="playlist-detail__next-view">{{item.nextVideoSet.playCount/10000}} 万次观看</p>
							</div>
						</a>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
	</view>
</template>
<script>
	let utils = require("@/common/util.js")

	export default {
		data() {
			return {
				showLoading: true,
				scrollLeft: 0,
				refreshing: false,
				refreshText: '下拉可以刷新',
				item: {
					videoList:[],
					comments:[],
				},
				id: '',
			}
		},
		onLoad: function(event) {
			try {
				this.item = JSON.parse(decodeURIComponent(event.query));
			} catch (error) {
				this.item = JSON.parse(event.query);
			}
			this.id = this.item.id;
			this.init();
		},
		onPullDownRefresh(event){
			this.refreshText = '正在刷新...';
			this.refreshing = true;
		},
		onShareAppMessage() {
			var data = JSON.parse(JSON.stringify(this.item));
			data.nextVideoSet = "";
			data.videoList = "";
			data.id = this.id;
			console.log(JSON.stringify(data));
			return {
				title: data.title,
				path: '/pages/hot-v/miui/detail?query=' + encodeURIComponent(JSON.stringify(data))
			}
		},
		methods: {
			init: function(){
				var that = this;
				uni.request({
					url:'https://bukaa.cn/api-cms/hot/miui/video/detail?videoSetId=' + this.item.id,
					success(result) {
						var data = result.data;
						if (data.status === 'ok' && data.data){
							that.item = data.data.data;
						}
					}
				})
			},
			goDetail(detail) {
				uni.navigateTo({
					url: '/pages/hot-v/miui/detail?query=' + encodeURIComponent(JSON.stringify(detail))
				});
			},
		}
	}
</script>
<style>
@import url("../../../static/css/mymovie/mymovie.css");
</style>
